<script type="text/javascript" src="<?php echo ThemePath(); ?>/js/jquery.blockUI.js"></script>
<!--=================   Category Section Starts ======================   -->
<section id="cat-page">
    <div class="container">
        <div class="row">
            <div class="col-lg-4 col-md-3 col-sm-4 col-xs-12">
                <!--bread-->
            </div>
            <input type="hidden" id="current_category" >
            <input type="hidden" id="current_classcourse_type"  value="<?php echo (isset($_GET['type'])) ? $_GET['type'] : ''; ?>">
            <input type="hidden" id="current_class_for" >
            <input type="hidden" id="current_schedule" >
            <input type="hidden" id="current_schedule_post_work" value="<?php echo (isset($_GET['searchtype']) && $_GET['searchtype'] == SEARCH_TYPE_POST_WORK) ? SEARCH_CLASS_POST_WORK_VAL : ''; ?>" >
            <div class="col-lg-offset-3 col-lg-5 col-md-7 col-md-offset-2 col-sm-7 col-sm-offset-1 col-xs-12">
                <div class="cat-content">
                    <strong>Sort By</strong>
                    <div class="input-group">
                        <select class="form-control selelectFilter" id="mostpopular">
                            <option value="">Select class type</option>                          
                            <option value="1">Most Popular</option>
                            <option value="2">Most View </option>
                        </select>
                        <span class="decor"></span>
                        <select class="form-control selelectFilter" id="priceorder">
                            <option value="">Price Order</option>
                            <option value="1">Ascending Order</option>
                            <option value="2">Descending Order</option>
                        </select>
                        <span class="decor1"></span>
                    </div><!-- /input-group -->
                </div>
            </div>
        </div>
    </div>

    <div class="clearfix"></div>

    <!-- Category Page Main Container -->
    <div class="container cat-show">
        <div class="row">

            <div class="col-lg-3 col-md-3 col-sm-3">
                <?php echo CHtml::dropDownList('location_name', '', CHtml::listData(ClassVenue::model()->findAll('status=' . SkillConfig::STATUS_ACTIVE . '   GROUP BY  ' . LTRIM('venue_locality') . ' ORDER BY venue_locality'), 'id', 'venue_locality'), array('empty' => 'Select Location', 'class' => 'form-control selectsort', 'id' => 'select_location_id')); ?>
                <span class="decor2"></span>
                <div class="clearfix"></div>

                <div class="content-box">
                    <strong>Type</strong><br>
                    <input type="radio" name="form-radio" class="radioClassType" id="workshops" value="workshop" data-title="workshopcl"   checked="checked">
                    <label id="workshoping" for="workshops">Workshops</label>
                    <br>
                    <input type="radio" name="form-radio" id="courses" class="radioClassType" data-title="cou" value="course"  >
                    <label for="courses">Courses</label>
                    <br>
                    <input type="radio" name="form-radio" class="radioClassType" id="exclusive" data-title="ex" value="curatedclasses"  >
                    <label for="exclusive">Exclusives</label>
                    <br>

                </div>
                <div class="clearfix"></div>

                <div class="content-box">
                    <strong>Category</strong><br>
                    <?php
                    $categorys = Category::model()->findAll('status=' . SkillConfig::STATUS_ACTIVE);
                    foreach ($categorys as $category) {
                        ?>
                        <input type="checkbox" id="category_<?php echo $category->id; ?>"class="selectsort " value="<?php echo $category->id; ?>"> <label for="category_<?php echo $category->id; ?>"><?php echo $category->name; ?></label><br>  
                    <?php } ?>

                </div>
                <div class="clearfix"></div>

                <div class="content-box">
                    <strong>Functionality</strong><br>
                    <input type="checkbox"  name="functionality" class="selectsort" id="schedule_1" <?php echo (isset($_GET['searchtype']) && $_GET['searchtype'] == SEARCH_TYPE_WEEKEND) ? "checked=checked" : ''; ?> value="<?php echo SEARCH_CLASS_WEEKEND_SET_DAY_SESSION; ?>">
                    <label for="schedule_1"><?php echo SEARCH_CLASS_WEEKEND; ?></label><br/>
                    <input type="checkbox"  name="functionality" class="selectsort" id="scheduless_2" <?php echo (isset($_GET['searchtype']) && $_GET['searchtype'] == SEARCH_TYPE_KIDS) ? "checked=checked" : ''; ?> value="<?php echo SEARCH_CLASS_KIDS_SET_DAY_SESSION; ?>">
                    <label for="scheduless_2"><?php echo SEARCH_CLASS_KIDS_CLASS; ?></label><br/>
                    <input type="checkbox"  name="functionality" class="selectsort" id="postwork_3" <?php echo (isset($_GET['searchtype']) && $_GET['searchtype'] == SEARCH_TYPE_POST_WORK) ? "checked=checked" : ''; ?> value="<?php echo SEARCH_CLASS_POST_WORK_VAL; ?>">
                    <label for="postwork_3"><?php echo SEARCH_CLASS_POST_WORK; ?></label><br/>

                </div>

                <div class="clearfix"></div>

                <div class="content-box">
                    <strong>Price</strong><br>
                    <input type="text"readonly="readonly" id="pricetag" Placeholder="0 - 15000 Rs." value="">
                    <input id="ex2"  type="text" class="span2" value="" data-slider-min="0" data-slider-max="15000" data-slider-step="5" data-slider-value="[0,15000]" data-slider-tooltip="show"/>
                </div>

                <div class="content-box">
                    <strong>Date(s)</strong><br>
                    <span class="devlv"></span>
                    <input type="text" class="span2" value="" id="dp3" autocomplete="on" Placeholder="From" data-date-format="yyyy-mm-dd">
                    <span class="devlv1"></span>
                    <input type="text" class="span2" value="" id="dp4" autocomplete="on" Placeholder="To" data-date-format="yyyy-mm-dd">
                </div>


            </div>


            <div class="col-lg-9 col-md-9 col-sm-9">
                <?php
                $this->widget('zii.widgets.CListView', array(
                    'dataProvider' => $dataProvider,
                    'id' => 'ajaxListView',
                    //'summaryText' => '',
                    'itemView' => '//courses/_runningClassCoursedataprovider',
                ));
                ?>     


            </div>
        </div>
    </div>

    <!-- Gap Class Started -->
    <div class="gap"></div>
    <div class="gap"></div>
    <!-- Gap Class Ends Here -->
    <div class="clearfix"></div>
</section>   
<!--=================== Category Section Ends==================== -->
<div class="clearfix"></div>

<?php /* Literally Ending tomorrow Slider */ ?>
<?php
$allClassCourseInfo = array();
$classDetails = getAllliteralEndingTommorowWorkshop('', '', '',LITERAL_ENDING_RENDER_PAGE_LIMIT);
$courseDetails = getAllliteralEndingTommorowCourses('', '', '',LITERAL_ENDING_RENDER_PAGE_LIMIT); //Null parameter means these value $profiles, $userType, $getValue)
$allClassCourseInfo = array_merge($classDetails, $courseDetails);
usort($allClassCourseInfo, 'date_compare');
if (!empty($allClassCourseInfo)) {
    $this->renderPartial('/classes/literallyEndingtomorrow', array('allClassCourseInfo' => $allClassCourseInfo));
}
?>

<?php
Yii::app()->clientScript->registerScript('search', "var ajaxUpdateTimeout;
    var ajaxRequest;
    $('.selelectFilter').change(function(){
 getAjaxListUpdate('ajaxUpdateTimeout','ajaxRequest');
    });
   $('.selectsort').change(function() {
             var array = this.id.split('_');
                var allVals = [];
                var allClassFor = [];
                var allscheduleFor = [];
            if (this.checked) {               
                if (array[0] == 'classfor') {
                    $('#classfor_' + array[1]).addClass('classFor');
                    $('.classFor').each(function() {
                        allClassFor.push($(this).val());
                    });
                    $('#current_class_for').val(allClassFor);
                }
                if (array[0] == 'postwork') {                
                    $('#current_schedule_post_work').val($('#'+this.id).val());
                }

                if (array[0] == 'schedule') {
                    $('#schedule_' + array[1]).addClass('scheduleFor');
                    $('.scheduleFor').each(function() {
                        allscheduleFor.push($(this).val());
                    });
                    $('#current_schedule').val(allscheduleFor);
                }
                if (array[0] == 'category') {
                    $('#category_' + array[1]).addClass('categoryCheckBox');
                    $('.categoryCheckBox').each(function() {
                        allVals.push($(this).val());
                    });
                    $('#current_category').val(allVals);
                }
            } else {
                if (array[0] == 'postwork') {
                
                    $('#current_schedule_post_work').val('');
                }
                if (array[0] == 'classfor') {
                    $('#classfor_' + array[1]).removeClass('classFor');
                    $('.classFor').each(function() {
                        allClassFor.push($(this).val());
                    });
                    $('#current_class_for').val(allClassFor);
                }
                if (array[0] == 'schedule') {
                    $('#schedule_' + array[1]).removeClass('scheduleFor');
                    $('.scheduleFor').each(function() {
                        allscheduleFor.push($(this).val());
                    });
                    $('#current_schedule').val(allscheduleFor);
                }
                if (array[0] == 'category') {
                    $('#category_' + array[1]).removeClass('categoryCheckBox');
                    $('.categoryCheckBox').each(function() {
                        allVals.push($(this).val());
                    });
                    $('#current_category').val(allVals);
                }
            }
            getAjaxListUpdate(ajaxUpdateTimeout, ajaxRequest);
        }
        );

"
);
?>
<script type="text/javascript">

    jQuery(document).ready(function() {
        $(".radioClassType").change(function() {
            var value = $("#" + this.id).val();
            $("#current_classcourse_type").val(value);
            if (value == 'course') {
                $("h2 a").removeClass("highlighted");
                $("#couursecategory").addClass("highlighted");
            }
            if (value == 'workshop') {
                $("h2 a").removeClass("highlighted");
                $("#workshopcl").addClass("highlighted");
            }
            if (value == 'curatedclasses') {
                $("h2 a").removeClass("highlighted");
                $("#exclusivescategory").addClass("highlighted");
            }
            getAjaxListUpdate('ajaxUpdateTimeout', 'ajaxRequest');
        });
        $("#ex2").slider({
            tooltip: 'always',
            formater: function(value) {
                return value + ' Rs ';
            }
        });
        $("#ex2").on('slideStop', function(slideEvt) {
            $("#pricetag").val(slideEvt.value);
            getAjaxListUpdate('ajaxUpdateTimeout', 'ajaxRequest');
        });
        $('#dp3,#dp4').datepicker()
                .on('changeDate', function(ev) {
            format: 'yyyy-mm-dd',
                    $(this).datepicker('hide');
            if ($("#dp3").val() != '' && $("#dp4").val() != '')
                getAjaxListUpdate('ajaxUpdateTimeout', 'ajaxRequest');
        });
    });


    function getAjaxListUpdate(ajaxUpdateTimeout, ajaxRequest) {
        var postwork = $('#current_schedule_post_work').val();
        if ($("#schedule_2").is(':checked')) {
            var searchtype = $('#schedule_2').val();
        }
        else {
            var searchtype = '';
        }

        var dateFrom = $("#dp3").val();
        var dateto = $("#dp4").val();
        var priceorder = $("#priceorder").val();
        var mostpopular = $("#mostpopular").val();
        var type = $("#current_classcourse_type").val();
        var amountRange = $("#pricetag").val();
        var location = $("#select_location_id").val();
        var schedule = $("#current_schedule").val();
        var tragetAudience = $('#current_class_for').val();
        var categoryId = $('#current_category').val();
        var sort_respond_unrespond = $('#sort_respond_unrespond').val();
        var sort_converted_unconverted = $('#sort_converted_unconverted').val();
        ajaxRequest = 'category=' + categoryId + '&tragetAudience=' + tragetAudience + '&location=' + location + '&amountRange=' + amountRange + '&scheduleId=' + schedule + '&dateFrom=' + dateFrom + '&dateto=' + dateto + '&type=' + type + '&postwork=' + postwork + '&priceorder=' + priceorder + '&mostpopular=' + mostpopular + '&searchtype=' + searchtype;
        clearTimeout(ajaxUpdateTimeout);
        ajaxUpdateTimeout = setTimeout(function() {
            imageloding();
            $.fn.yiiListView.update(
                    'ajaxListView',
                    {data: ajaxRequest}

            )
        },
                100);
        $(document).ajaxStop($.unblockUI);
    }

</script>


